简介:主要学习媒体查询、flex弹性布局及伸缩比例的计算,通过rem作为度量单位进行弹性布局的方法
第1章 课程介绍
您已经使用html+css一段时间了,是否好像一直都是用px或%进行定位,是否页面布局时也是一直使用float+定位,自适应,响应式等似乎明白又说不清。本门课程让你在之前的基础上,思路更清晰,技术上有多种选择。
第2章 mediaquery媒体查询
在移动端开发中,手机,ipad等设备的尺寸各不相同,总不能适用一个设备,其他设备显示效果就“将就”吧,web端也同样存在这种情况。那么mediaquery,中文名称“媒体查询”,将解决这些困扰。
第3章 flex基础与应用
float+定位进行布局,是每一个前端工程师的必修课,但布局上如果只有这一个招数,那就有点掣肘了。css中还有一个flex技术,称为弹性盒子,可以非常高效的完成盒子内的布局,将会在布局上如虎添翼。
第4章 常用布局
px,%,还有em,都已成过去式,它们都重要,但不能作为未来的主流。rem,以基准字体为标准,一变百变,适应各种复杂的页面弹性伸缩,对文字也有很好的适应性。在进行响应式布局上,是不可或缺的技术。